<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui">

<f:view>
	<ui:composition template="layout/layout.xhtml">
		<ui:define name="body" styleClass="todo">

			<p:messages id="msgsGrupoUsuarioFrm" />


			<h:form rendered="#{loginBean.usuarioLogueado}">
				<p:messages id="msgsGrupoUsuarioFrm" />
				<p:panel header="Datos Del Grupo">
					<h:panelGrid columns="2">
						<h:outputLabel value="*Nombre del Grupo:" />
						<h:inputText id="descGrupoUsuario" required="true" value="#{adminBean.nuevoGrupoUsuario.descripcion}" label="Nombre del Grupo" />

						<h:outputLabel value="*Seleccione Coordinador:" />
						<p:selectOneMenu value="#{adminBean.coordinadorSelecItem}" label="Seleccione Coordinador" required="true" panelStyle="width:250px"
							style="width:260px">
							<f:selectItem itemLabel="Seleccione" itemValue="" />
							<f:selectItems value="#{adminBean.selectItemsUsuarios}" />
							<p:ajax immediate="true" />
						</p:selectOneMenu>
					</h:panelGrid>
				</p:panel>

				<p:panel header="Personal del grupo">

					<p:pickList id="pojoPickList" value="#{adminBean.lstUsuarios}" var="usuario" effect="bounce" itemValue="#{usuario}"
						itemLabel="#{usuario.idUsuario}" converter="usuarioConverter" showSourceControls="true" showTargetControls="true" showCheckbox="true"
						showSourceFilter="true" showTargetFilter="true" filterMatchMode="contains">

						<f:facet name="sourceCaption">Disponible</f:facet>
						<f:facet name="targetCaption">En el grupo</f:facet>

						<p:ajax event="transfer" listener="#{adminBean.onTransfer}" />

						<p:column style="width:25%">
							<p:graphicImage value="#{usuario.imagen}" width="30" height="40" />
						</p:column>

						<p:column style="width:75%;">  
            					#{usuario.nombres} , #{usuario.apellidos} 
        					</p:column>

					</p:pickList>
				</p:panel>

				<p:commandButton value="#{msg.titulo_guardar}" icon="ui-icon-disk" action="#{adminBean.guardarGrupo}" update="msgsGrupoUsuarioFrm"
					immediate="true" />
			</h:form>


		</ui:define>
	</ui:composition>
</f:view>
</html>
